<template>
	<view class="page cleaner bgf7 c85">
		<image class="w-20 bg" src="/static/img/bg/home_bg.png"></image>
		<view class="aliC cff title pb16 rel" :style="{paddingTop: statusBar + 'px'}">打扫员主页</view>
		<view class="flex flexC rel cff px15" @click="showShop">
			<image class="down" src="/static/img/icon/location.png" mode="widthFix"></image>
			<text class="px6">{{selectShop.name}}</text>
			<image class="right" src="/static/img/icon/right_nor.png" mode="widthFix"></image>
		</view>
		<scroll-view scroll-y="true" :style="{height: 'calc(100vh - 214rpx - ' + statusBar +'px)'}">
			<view class="bgff flex flexC flexB aliC rel r7 py20 mt18 mx15 shadow">
				<view class="flex1">
					<view class="c85 mb8">全部</view>
					<view class="bold6 c00">{{all}}</view>
				</view>
				<view class="flex1">
					<view class="c85 mb8">等待打扫</view>
					<view class="bold6 c00">{{undo}}</view>
				</view>
				<view class="flex1">
					<view class="c85 mb8">超时未打扫</view>
					<view class="bold6 c00">{{undone}}</view>
				</view>
				<view class="flex1">
					<view class="c85 mb8">已打扫</view>
					<view class="bold6 c00">{{done}}</view>
				</view>
			</view>
			<view v-for="(item,index) in list" :key="index" class="bgff m15 r7 pt24 pb20 px12 shadow">
				<view class="flex flexC">
					<image class="w82 r6" :src="item.room.logo" mode="aspectFill"></image>
					<view class="flex1 ml12">
						<view class="bold6">{{item.room.name}}</view>
						<view class="fs13 py10">订单结束时间：{{item.start_time_text}}</view>
						<view class="fs13 flex flexC" >
							<view v-if="item.min != ''">
								<text >还剩</text>
								<text class="cff0 bold6 px6">{{item.min}}分钟</text>
								<text>结束</text>
							</view>
							
							<text class="flex1 aliR cff0 bold6">{{item.status_txt}}</text>
						</view>
					</view>
				</view>
				<view class="flex flexC mt10 aliC">
					<text class="flex1"></text>
					<text class="bged r40 w72 py4 mx6" @click="open('door',item)">开大门</text>
					<text class="bgf6 r40 w72 py4 mx6" @click="open('room',item)">开门打扫</text>
					<text class="bgf6 r40 w72 py4 mx6" @click="okDone(item)">完成打扫</text>
					
				</view>
			</view>
			
		
		</scroll-view>

		<view class="button2" @click="open2()">
			<image src="../../static/img/icon/doorbtn.png"></image>
		</view>
		<!-- 店铺选择 -->
		<uni-popup ref="shopPicker" type="bottom">
			<shop-list @search="search" :list="shopList" @onSelectShop="onSelectShop" @close="onClose"></shop-list>
		</uni-popup>
	
		<tabbar></tabbar>
	</view>
</template>

<script>
	const plugin = requirePlugin("myPlugin");
	
	const statusBar = uni.getSystemInfoSync().statusBarHeight + 10;
	export default {
		data() {
			return {
				shopList:[],
				statusBar,
				selectShop:null,
				list: [
				],
				all:0,
				undo:0,
				done:0,
				undone:0
			}
		},
		onLoad() {
			this.getShopList();
		},
		methods: {
			
			okDone(item){
				let param = {
					room_id: item.room_id,
					id:item.id
				};
				let that = this;
				this.$api.cleanDone(param).then(res => {
				
					console.info(JSON.stringify(res));
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					if (res.code == 1) {
						that.getIndex();
					} else {
				
					}
				})
			},
			
			open2(){
				let param = {
					shop_id: this.selectShop.id,
					type:'door',
				};
				let that = this;
				this.$api.cleanOpen(param).then(res => {
				
					console.info(JSON.stringify(res));
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					if (res.code == 1) {
						if (res.data.is_bt == 1) {
							that.getBtLockData(res.data);
						}
					} else {
				
					}
				})
			},
			
			open(type,item){
				let param = {
					room_id: item.room_id,
					type:type,
					id:item.id
				};
				let that = this;
				this.$api.cleanOpen(param).then(res => {
				
					console.info(JSON.stringify(res));
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					if (res.code == 1) {
						if (res.data.is_bt == 1) {
							that.getBtLockData(res.data);
						}
					} else {
				
					}
				})
			},
			
			getBtLockData(data) {
			
			
				let param = {
					shop_id: data.shop_id,
					room_id: data.room_id,
				}
				let that = this;
				this.$api.btLockInfo(param).then(res => {
					if (res.code == 1) {
						console.info(res.data);
						that.openLock(res.data);
					} else {
			
					}
			
				})
			
			
			},
			
			openLock(res) {
			
			
				uni.showLoading({
					title: "正在开启智能锁",
				})
				const start = Date.now();
				// 调用开锁接口
			
			
				var deviceId = res.lockMac;
				var lockData = res.lockData;
				plugin.controlLock(plugin.ControlAction.OPEN, lockData, res => {
					if (res.errorCode === 10003) {
						console.log("获取版本信息时设备连接已断开", res)
					}
				}, null, deviceId).then(res => {
					uni.hideLoading({});
					console.log(res)
					if (res.errorCode == 10012) {
						uni.showModal({
							title: "提示",
							content: "蓝牙未开启,请开启蓝牙",
							showCancel: false,
			
						})
					}
					if (!!res.deviceId) deviceId = res.deviceId;
					if (res.errorCode === 0) {
						console.info(`已开锁--操作时间:${Date.now() - start}ms.`)
					} else {
			
						console.info(`开锁失败: ${res.errorMsg}`)
					}
				})
			},
			
			showShop() {
				this.$refs.shopPicker.open();
			
			},
			search(value) {
			
				this.keyword = value;
				this.getShopList();
			},
			
			onSelectShop(item) {
				this.$refs.shopPicker.close();
				this.getIndex();
				
			},
			
			getIndex(){
				
				let param = {
					shop_id: this.selectShop.id
				};
				let that = this;
				this.$api.getCleanList(param).then(res => {
				
					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.list = res.data.list;
						that.all = res.data.all;
						that.done = res.data.done;
						that.undone = res.data.undone;
						that.undo = res.data.undo;
						
					} else {
				
					}
				})
			},
			
			getShopList() {
				let param = {
					keyword: this.keyword
				};
				let that = this;
				this.$api.getStaffShopList(param).then(res => {

					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.shopList = res.data;
						if (that.shopList.length > 0) {
							that.selectShop = that.shopList[0];
							that.getIndex();
							

						}
					} else {

					}
				})
			},

			onClose() {
				this.$refs.shopPicker.close();
			}
		}
	}
</script>

<style lang="scss" scoped>
	.cleaner {
		.down {
			width: 36rpx;
			height: 36rpx;
		}

		.bg {
			position: fixed;
			top: 0;
			left: 0;
			z-index: 0;
		}
		.button2{
			position: fixed;bottom: 60px;left: 10rpx;
			image{
				width: 120rpx;
				height: 120rpx;
			}
		}

		.rel {
			position: relative;
		}

		.right {
			width: 14rpx;
		}

		.w36 {
			width: 72rpx;
			height: 72rpx;
		}

		.w82 {
			width: 164rpx;
			height: 164rpx;
		}

		.w72 {
			width: 144rpx;
			display: inline-block;
		}
	}
</style>
